[Day1] 簡介與開發框架

主題緣由

由於在前陣子開發個人專案時想要使用 WebRTC 的技術完成線上直播讀書會的功能，過程中到處爬文，發現網路上大多是使用 Socket IO + WebRTC 的範例，發現比較少人使用 WebRTC + Firebase，所以在各種研究與討論下才完成我要的功能，秉持一個取之於網路，回饋於網路的精神，想要把過程中所學的記錄下來，也幫助需要的人們~

目錄

• 網頁通訊概念
• WebRTC 介紹
• firebase 介紹
• 一對一通訊實作

實做開發 Base on~

• React.js

  官方目前有vanilla js+Firebase v8 Codelab，而這次實作會使用 React 框架。

  官方 Firebase + WebRTC Codelab

  官方 FirebaseRTC

• Firebase

  Firebase 是一個由 Google 提供的強大的後端服務和開發平台，對前端開發帶來了許多好處。它簡化了伺服器端的工作，提供了許多有用的工具和服務。所以本次會 Firebase v9 用他來替代 Socket IO 讓前端也能快速上手!

  雖然 WebRTC 可以建立直接連接，但需要一個資料庫來處理初始連接建立、用戶之間的協議以及資訊配置。

• WebRTC

  WebRTC（Web Real-Time Communication）是一個開源網路技術，用於實現瀏覽器之間的實時音訊、視訊和數據通信，無需外部插件或擴展。

• Styled-components

  這次開發由於使用 React 框架所以選用了我比較熟悉的 CSS in JS 可以在 JSX 中撰寫 CSS code

前面會花很多篇幅介紹通訊協定的一些基本概念，希望接下來能順利完賽😎